<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta
			name="viewport"
			content="width=device-width, initial-scale=1.0"
		/>
		<title>Document</title>
		<link
			rel="stylesheet"
			href="css/bootstrap.min.css"
		/>
		<link
			rel="stylesheet"
			href="css/login.css"
		/>
		<script
			type="text/javascript"
			src="js/jquery.min.js"
		></script>
	</head>

	<body>
		<div class="container-login">
			<div class="container-pic">
				<img
					src="pic/computer.png"
					width="350px"
				/>
			</div>
			<div class="login-dialog">
				<h3>登陆</h3>
				<div class="row">
					<span>用户名</span>
					<input
						type="text"
						name="userName"
						value="zhangsan"
						id="userName"
						class="form-control"
					/>
				</div>
				<div class="row">
					<span>密码</span>
					<input
						type="password"
						value="123456"
						name="password"
						id="password"
						class="form-control"
					/>
				</div>
				<div class="row">
					<button
						type="button"
						class="btn btn-info btn-lg"
						onclick="login()"
					>
						登录
					</button>
				</div>
			</div>
		</div>
		<script src="js/jquery.min.js"></script>
		<script>
			function login() {
				// location.href = "book_list.html";
				$.ajax({
					url: '/user/login',
					method: 'post',

					data: {
						username: $('#userName').val(),
						password: $('#password').val(),
					},
					success(result) {
						console.log(result)
						const { errMsg, code } = result
						if (code === 'SUCCESS') {
							// 成功
							location.href = 'book_list.html'
						} else {
							// 失败
							alert(errMsg)
						}
					},
					error(result) {
						console.log(result)
					},
				})
			}
		</script>
	</body>
</html>
